import React, {Component} from 'react';
import {HashRouter as Router, Switch, Link, Route} from 'react-router-dom';

import './dashboard.css';
import Collect from '../../pages/Collect';

class Dashboard extends Component {
    render() {
        console.log(this.props.location.pathname);
        return (
            <Router>
                <div className="dashboard">
                    {/*后台的首页一般是一个品字形的布局*/}
                    <div className="header">头部</div>
                    <div className="main">
                        <div className="left">
                            <Link to="/dashboard/collect">我的收藏列表</Link>
                        </div>
                        <div className="right">
                            {/*嵌套路由：定义的时候，我们需要加上 一级页面的路由前缀 */}
                            {/* /dashboard 前缀必须加上 */}
                            {
                                this.props.location.pathname == '/dashboard/' ? <Collect/> : null
                            }
                            <Switch>
                                <Route path="/dashboard/collect" component={Collect}></Route>
                            </Switch>
                        </div>
                    </div>
                </div>
            </Router>

        );
    }
}

export default Dashboard;
